<template>
  <div class="box">
    <userinfo />
    <indent />
    <service />
    <banner />
    <LookLook />
    <homebottom  class="bottom"/>
  </div>
</template>
<script type="text/javascript" src="https://cdn.bootcss.com/touchjs/0.2.14/touch.js"></script>
<script>
import userinfo from "./details/userinfo.vue";
import indent from "./details/indent.vue";
import service from "./details/service.vue";
import banner from "./details/banner.vue";
import LookLook from "./details/LookLook.vue";
import homebottom from "./homebottom.vue";
// import $ from "jquery";
export default {
  name: "mine",
  components: {
    indent,
    userinfo,
    service,
    banner,
    LookLook,
    homebottom
  },
};
// let $Box2 = $(".box");
// $Box2.on("swipe", function () {
//   console.log("swipe");
// });
// $Box2.on("swipeRight", function () {
//   console.log("swipeRight");
// });
</script>

<style scoped>
.box {
  background: #eaeaea;
}
.content-box {
  width: 100%;
  height: 1.2rem;
  display: flex;
  justify-content: space-around;
}

.content-box li {
  flex: 1;
  border: 1px solid pink;
}

.content-box img {
  width: 100%;
  height: 0.7rem;
}

.content-box p {
  text-align: center;
  height: 0.25rem;
}
.bottom{
  position: fixed;
  left: 0;
  bottom: 0;
} 
</style>
